<template>
    <div>
        <el-row>
            <el-col :span="24" class="medias-add-form">
         <el-tabs v-model="activeName"  @tab-click="handleClick">
            <el-tab-pane label="影音先锋App广告" name="txt" :disabled="tabDisabled"> 
                <!--  -->
                <xfplay-app-adverte-setting  
                :medias-row="mediasRow"
                 v-on:onclosedrawer="onCloseDrawer"></xfplay-app-adverte-setting>
            </el-tab-pane>
            <!--  -->
            <el-tab-pane label="猎鹰浏览器" name="image" :disabled="tabDisabled">
                <!--  -->
                  <lybrowers-adverte-setting  
                  :medias-row="mediasRow"
                   v-on:onclosedrawer="onCloseDrawer"></lybrowers-adverte-setting>
            </el-tab-pane>
            <!--  -->
            <!-- <el-tab-pane label="富媒体" name="html" :disabled="tabDisabled">
             
                  <medias-form-html
                  :medias-row="mediasRow"
                   v-on:onclosedrawer="onCloseDrawer"></medias-form-html>
            </el-tab-pane> -->
            <!--  -->
            <!-- <el-tab-pane label="Flash广告" name="flash" :disabled="tabDisabled">
             
                  <medias-form-flash
                  :medias-row="mediasRow"
                   v-on:onclosedrawer="onCloseDrawer"></medias-form-flash>
            </el-tab-pane> -->
            <!--  -->  
             <!-- <el-tab-pane label="视频广告" name="video" :disabled="tabDisabled">
             
                  <medias-form-video
                  :medias-row="mediasRow"
                   v-on:onclosedrawer="onCloseDrawer"></medias-form-video>
            </el-tab-pane> -->
                  <!--  -->
        </el-tabs>
            </el-col>
        </el-row>
    </div>
</template>


<script>
import LybrowersAdverteSetting from './LybrowersAdverteSetting.vue';
// import MediasFormImage from './MediasFormImage.vue';
// import MediasFormTxt from './MediasFormTxt.vue'
export default {
  components: {LybrowersAdverteSetting },
  props: ['mediasRow'],
   data() {
       return {
           tabDisabled: false,
           //activeName: 'txt'
       }
  },
  created: function(){
     if(this.mediasRow && this.mediasRow.hasOwnProperty("id")){
          this.tabDisabled = true;
     }else{
         this.tabDisabled = false;
     }
  },
  computed: {
  
    // 编辑时 选中 别编辑的 素材内容tab
    activeName:{
          get(){
              if(this.mediasRow && this.mediasRow.type){
                  return this.mediasRow.type;
              }
              return 'txt';
          },
          // 点击 tab时 切换设置；
          set(value){
              //console.log(this.mediasRow)
             if(this.mediasRow && this.mediasRow.id>0){
                   return value;
              }else{
                    return value;
              }
              
          }
      }
  },
  methods:{
      handleClick(tab){
          this.activeName = tab.name;
         // console.log(this.activeName)
      },
      onCloseDrawer(from){
           this.$emit("onclosedrawer", from)
      }
  }
}
</script>
